<template>
  <div id="app">
    <router-view></router-view>
    <TableBar>
      <TableBarItem :path="test" activecolor="blue">
        <i slot="icon" class="iconfont icon-home"></i>
        <p slot="title">首页</p>
      </TableBarItem>
      <TableBarItem path="/classify" activecolor="yellow">
        <i slot="icon" class="iconfont icon-modular"></i>
        <p slot="title">分类</p>
      </TableBarItem>
      <TableBarItem path="/news" activecolor="pink">
        <i slot="icon" class="iconfont icon-menu"></i>
        <p slot="title">消息</p>
      </TableBarItem>
      <TableBarItem path="/user" >
        <i slot="icon" class="iconfont icon-user"></i>
        <p slot="title">我的</p>
      </TableBarItem>
    </TableBar>
  </div>
</template>
<script>
import TableBar from "@/components/TabBar/TableBar.vue";
import TableBarItem from "@/components/TabBar/TableBarItem.vue";
import router from "./router";

export default {
  data(){
    return{
      test:"/home"

    }
  },
  components: {
    TableBar,
    TableBarItem,
    router
},
 
};
</script>
<style>
@import url("./assets/css/reset.css");
@import url("./assets/iconfont/iconfont.css");
</style>
